import React from 'react'
import {Outlet} from 'react-router-dom'
import { Layout } from 'antd';
import Header from './components/Header';
import Aside from './components/Aside';
import Bread from './components/Bread';
import { connect } from 'react-redux';


function App(props) {
  return (
    <Layout id='app'>
      <Header key={props.myKey}/>
      <Layout className='container'>
        {/* Aside组件有一个className为aside */}
        <Aside/>
          <div className='container_box'>
            <Bread/>
            <div className="container_content">
              <Outlet/>
            </div>
          </div>
      </Layout>
      <footer>Respect | Copyright &copy; 2022 Author 小马</footer>
    </Layout>
    
  )
}
const mapStateToProps = (state)=>{
  return {
    myKey: state.myKey
  }
}
export default connect(mapStateToProps)(App)